@charset "utf-8";

@function r($px) {
    @return($px/40) *1rem;
}

@function px($px) {
    @return($px/2) * 1px;
}
.mid{
    vertical-align: middle;
}
.txhz{
    display: -webkit-flex;
    display: flex;
}
.ib{
    display: inline-block;
    width: r(60);
}
#web {
    width: r(750);
    height: 100%;
    position: relative;
    padding-left: r(23);
    padding-right: r(19);
    box-sizing: border-box;
}
header{
    width: 100%;
    position: relative;
    padding-top: 24px;
    z-index: 2;
    background: white;
    .back{
        display: inline-block;
        width: 59px;
        height: 26px;
        border: 3px solid #ff9344;
        border-radius: 25px;
        text-align: center;
        vertical-align: middle;
        font-size: 21px;
    }
    .title{
        font-size: 13px;
        text-align: center;
        margin-top: 8px;
    }
    .searchBar {
        width: r(264);
        height: 25px;
        border: 1px solid #ff9344;
        border-radius: 25px;
        margin: 24px auto 0px;
        font-size: 0;
        padding: 0 5px;
        box-sizing: border-box;
        input {
            display: inline-block;
            vertical-align: middle;
            border: none;
            width: calc(100% - 24px);
            height: 100%;
        }
        img {
            vertical-align: middle;
            width: 18px;
            height: 18px;
        }
    }
    .selectBar {
        width: 79px;
        height: 27px;
        border: 1px solid #FF9344;
        margin-top: 1px;
        select {
            width: 100%;
            height: 100%;
            border: none;
            outline: none;
            vertical-align: top;
            //去除默认样式
            appearance: none;
            -webkit-appearance: none;
            background-image: url(../img/dsjx_09.jpg);
            background-repeat: no-repeat;
            background-size: 15px 8px;
            background-position: right 6px center;
        }
    }
}
footer {
    width: r(750);
    height: px(136);
    position: absolute;
    left: 0;
    bottom: 0;
    li {
        width: 25%;
        text-align: center;
        .iconfont{
           font-size: r(72);
           color: white;
           -webkit-text-stroke: 1px #FF9344;

        }
        .wz26{
            font-size: r(26);
            color: black;
        }
    }
    
        .fenlei{
            .iconfont{
            color: #ff9344;
            }
        }
        .wode{
            .iconfont{
            color: #ff9344;
            }
        }
}
.session{ 
    position: absolute;
    top: 75px;
    bottom: px(136);
    
    //纵向滚动
    overflow-y: scroll;
    //弹性滚动
    -webkit-overflow-scrolling: touch;
    .sousuo{
        margin-top: r(63);
        text-align: center;
        .title{
        font-size: r(26);
        
       
        }
        .xuanxiang{
            display: -webkit-flex;
            display: flex;
            justify-content: space-between;
            align-items: center;
            flex-wrap: wrap;
            width: r(512);
            height: r(130);
            margin: r(14) auto 0;
        }
        .cfx{
            width: r(124);
            height: r(63);
            background: #dcdcdc;
            font-size: r(20);
            color: #898989;
            line-height: r(63);
        }
    }
    .session1{
        width: 100%;
        
        margin-top: r(49);
        .fl{
            img{
                width: r(35);
            }
            span{
                font-size: r(30);
            }
        }
        .fr{
            img{
                width: r(25);
            }
            span{
                font-size: r(30);
            }
        }
    }
    .session2{
        margin-top: r(31);
        justify-content: space-between;
        .zbhz{
            align-items: flex-start;
                width: r(278);
        }
        .rmss1{
                width: r(278);
           }
        .rmss2{
                    width: r(419);
           }
        .rmss3{
                    width: r(195);
           }
         .rmss4{
                    width: r(211);
           }
        .zy10{    
                    width: r(419);
                  //换行
                  flex-wrap: wrap;
                  //上下整体对齐
                  align-items: flex-start;
                  height: r(350);
                  //水平空间对齐
                  justify-content: space-between;
                  //垂直空间对齐
                  align-content: space-between;
                  width: r(420);
            }  
    }
    .session3{
        width: 100%;
        margin-top: r(47);
        .fl{
            img{
                width: r(41);
            }
             span{
                font-size: r(30);
            }
        }
        .fr{
            img{
                width: r(25);
            }
            span{
                font-size: r(30);
            }
        }
    }
    .session4{
        justify-content: space-between;
        align-items: flex-start;
        margin-top: r(49);
        margin-bottom: r(47);
        img{
            width: r(227);
        }
    }
}